<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title></title>
	<meta name="robots" content="index, follow" />
	<meta http-equiv="imagetoolbar" content="no" />
	<meta name="keywords" content="" />
	<meta name="description" content="" />

	<!-- Basic CSS Style (other styles are included in this file) -->
	<link rel="stylesheet" type="text/css" href="__CSS__/style.css" media="screen" />
	
	<!-- JavaScript Files -->
	<script type="text/javascript" src="__JS__/jquery.js"></script>
	<script type="text/javascript" src="__JS__/superfish.js"></script>

	<script type="text/javascript" src="__JS__/portfolio.filter.js"></script>
	<script type="text/javascript" src="__JS__/jPages.js"></script>
	<script type="text/javascript" src="__JS__/jquery.prettyPhoto.js"></script>
	<script type="text/javascript" src="__JS__/mosaic.1.0.1.js"></script>

	<script type="text/javascript">
$(document).ready(function() {

    // prettyPhoto
	$('.zoom').mosaic({
        opacity: 0.7
    });
    $("#filter a[rel^='prettyPhoto']").prettyPhoto({
        theme: 'light_square', // or "dark_square" for dark style
        animation_speed: 'fast',
        overlay_gallery: false,
    });
});

</script>
<style>
	
.green-black {
	PADDING-RIGHT: 3px;
	PADDING-LEFT: 3px;
	PADDING-BOTTOM: 25px;

	PADDING-TOP: 3px;
	TEXT-ALIGN: center
}

.green-black A {
	BORDER-RIGHT: #2c2c2c 1px solid;
	PADDING-RIGHT: 5px;
	BORDER-TOP: #2c2c2c 1px solid;
	PADDING-LEFT: 5px;
	BACKGROUND:  #2c2c2c;
	PADDING-BOTTOM: 2px;
	BORDER-LEFT: #2c2c2c 1px solid;
	COLOR: #fff;
	MARGIN-RIGHT: 2px;
	PADDING-TOP: 2px;
	BORDER-BOTTOM: #2c2c2c 1px solid;
	TEXT-DECORATION: none
}

.green-black A:hover {
	BORDER-RIGHT: #aad83e 1px solid;
	BORDER-TOP: #aad83e 1px solid;
	BACKGROUND:  #aad83e;
	BORDER-LEFT: #aad83e 1px solid;
	COLOR: #fff;
	BORDER-BOTTOM: #aad83e 1px solid
}

.green-black A:active {
	BORDER-RIGHT: #aad83e 1px solid;
	BORDER-TOP: #aad83e 1px solid;
	BACKGROUND:  #aad83e;
	BORDER-LEFT: #aad83e 1px solid;
	COLOR: #fff;
	BORDER-BOTTOM: #aad83e 1px solid
}

.green-black SPAN.current {
	BORDER-RIGHT: #aad83e 1px solid;
	PADDING-RIGHT: 5px;
	BORDER-TOP: #aad83e 1px solid;
	PADDING-LEFT: 5px;
	FONT-WEIGHT: bold;
	BACKGROUND: #aad83e;
	PADDING-BOTTOM: 2px;
	BORDER-LEFT: #aad83e 1px solid;
	COLOR: #fff;
	MARGIN-RIGHT: 2px;
	PADDING-TOP: 2px;
	BORDER-BOTTOM: #aad83e 1px solid
}

.green-black SPAN.disabled {
	BORDER-RIGHT: #f3f3f3 1px solid;
	PADDING-RIGHT: 5px;
	BORDER-TOP: #f3f3f3 1px solid;
	PADDING-LEFT: 5px;
	PADDING-BOTTOM: 2px;
	BORDER-LEFT: #f3f3f3 1px solid;
	COLOR: #ccc;
	MARGIN-RIGHT: 2px;
	PADDING-TOP: 2px;
	BORDER-BOTTOM: #f3f3f3 1px solid
}
</style>


</head>

<body>
	

	<!-- Start Portfolio -->

	<div class="complex four-fifth" id="jPages">

		<!-- Start Portfolio With Pagination -->
		<div class="green-black">{$page}</div>

		<ul id="filter" class="image-grid four-column mosaic-pro"  >

			<volist name="products"  id="product">
				<!-- Start Portfolio Item -->
				<li id="id-{$product.id}" class="{$product.parent_id}_sort_{$vo.category}">
					<div class="prolist">
						<div class="imagebox">
							<div class="mosaic-block zoom">
								<a href="__ROOT__/{$product.image}" class="mosaic-overlay"  rel="prettyPhoto[portfolio]">&nbsp;</a>
								<div class="mosaic-backdrop"><img src="__ROOT__/{$product.image}" alt="" /></div>
							</div>
						</div>
						<div class="description">
							<span style="height:40px;display:block;"><h3><a href="portfolio_post.html" >{$product.name}</a></h3></span>
							<a class="blue-button"  href="__ROOT__/{$product.introduce}" title="{$product.name}" rel="prettyPhoto" style="margin-left: 50px">参数信息</a>
						</div>
					</div>
				</li>
				<!-- End Portfolio Item -->
			</volist>

		</ul>
		<!-- End Portfolio With Pagination -->

	</div>

	<!-- End Portfolio -->
</body>
</html>